{% extends "base.html" %}

{% load static %}

{% block content %}
    <div class="cart_list">
        <div class="cart_top">我的评论</div>
        <div class="cart_listbox">
            <table width="100%" cellpadding="0" cellspacing="0" border='0px'>
                <tr>
                    <th width='10%'>
                        <input type="checkbox" id="all"
                               style="margin-top: 20px; margin-left: 10px;width: 24px; height: 24px;">
                    </th>
                    <th width='10%'>评论商品</th>
                    <th width='10%'>评论商品图</th>
                    <th width='10%'>评论态度</th>
                    <th width='40%'>评论词句</th>
                    <th width='10%'>评论时间</th>
                    <th width='10%'>操作</th>
                </tr>
                    {% for goods_comment in goods_comments %}
                        <tr>
                            <th width='10%'>
                                <input type="checkbox" id="all"
                                       style="margin-top: 20px; margin-left: 10px;width: 24px; height: 24px;">
                            </th>
                            <!-- 须传入评论商品名称 -->
                            <th width='10%'>{{ goods_comment.goods.goods_name }}</th>
                            {% for img_path in goods_comment.goods.image_set.all %}
                            <th width='10%'>
                                <!-- 需完善img标签src属性 -->
                                <img src="/static/{{ img_path.img_address }}">
                            </th>
                            <!-- 须传入评论态度 -->
                            {% endfor %}
                            {% if goods_comment.comment_state == 2 %}
                                <th width='10%'>好评</th>
                            {% elif goods_comment.comment_state == 1 %}
                                <th width='10%'>中评</th>
                            {% elif goods_comment.comment_state == 0 %}
                                <th width='10%'>差评</th>
                            {% endif %}
                            <!-- 须传入评论商品语句 -->
                            <th width='40%'>{{ goods_comment.comment_statement }}</th>
                            <!-- 须传入评论商品时间 -->
                            <th width='10%'>{{ goods_comment.comment_time }}</th>
                            <th width='10%'>
                                <!-- 需完善a标签href属性 -->
                                <a href="/Buyer/my_comments_delete/?comment_id={{ goods_comment.id }}">删除</a>
                            </th>
                        </tr>
                    {% endfor %}
            </table>
        </div>
    </div>
    <script>
        function submit() {
            var inputs = document.getElementsByName("checkbox");
            var result = "/buyer/enter_order?";
            for (var i = 0; i < inputs.length; i++) {
                if (inputs[i].checked) {
                    result += "key_" + i + "=" + inputs[i].value + "&"
                }
            }
            window.location.href = result.slice(0, -1)
        }

        function check(selector) {
            return document.querySelector(selector)//捕获的是一个数组
        }

        check("#all").onclick = function () {
            var input = document.getElementsByName("checkbox");
            for (var i = 0; i < input.length; i++) {
                input[i].checked = this.checked //this 执行函数的对象 checked 属性 返回当中选中的状态，也可以赋值使用
            }
        };
        var inputs = document.getElementsByName("checkbox");
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].onclick = function () {
                var flag = true;
                /*flag = false 底下的复选框全被选中*/
                for (var j = 0; j < inputs.length; j++) {
                    if (!inputs[j].checked) {
                        flag = false;
                    }
                }
                check('#all').checked = flag;
            }
        }


    </script>
{% endblock %}